<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns:th="http://www.thymeleaf.org"
	xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
	layout:decorator="main">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>题库显示</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript">
	var UnitAndLesson = null;

	$(document)
			.ready(
					function() {
						$("#addQuestion").click(function() {
							window.location.href = "/addStudentHTML";
						});

						var subject = $("#lesson\\.unit\\.subject\\.id").val();
						var grade = $("#lesson\\.unit\\.grade\\.id").val()
						/* alert(subject+"--------"+ grade); */

						//Ajax 获取所有的单元和课时 
						$.ajax({
							url : "/getUnitAjax",
							dataType : "json",
							type : "post",
							data : {
								'subject.id' : subject,
								'grade.id' : grade
							},
							success : function(data) {
								//0将data赋值给UnitAndLesson
								UnitAndLesson = data;
							}
						})

						// 00点击年级下拉菜单
						$("#lesson\\.unit\\.grade\\.id")
								.change(
										function() {
											var subjectId = $(
													"#lesson\\.unit\\.subject\\.id")
													.val();
											var gradeId = $(
													"#lesson\\.unit\\.grade\\.id")
													.val()
											$
													.ajax({
														url : "/getUnitAjax",
														dataType : "json",
														type : "post",
														data : {
															'subject.id' : subjectId,
															'grade.id' : gradeId
														},
														success : function(data) {
															//0将data赋值给UnitAndLesson
															UnitAndLesson = data;
															// 1定义默认选项
															var html = "<option value=''>-请选择一个章节-</option>";
															// 2 清空章节下的选项
															$(
																	"#lesson\\.unit\\.id")
																	.empty();
															$(
																	"#lesson\\.unit\\.id")
																	.append(
																			html);
															for (var i = 0; i < data.list.length; i++) {
																//3 根据后台数据循环添加选项
																html = "<option value="+data.list[i].id+">"
																		+ data.list[i].title
																		+ "</option>";
																$(
																		"#lesson\\.unit\\.id")
																		.append(
																				html);
																// $("#lesson\\.unit\\.id").html(html);
															}
															;
															// 4 设置 默认选中后台传入的章节
															//$("#lesson\\.unit\\.id").val([[${question.lesson} eq null ? '':(${question.lesson.unit} eq null ? '':${question.lesson.unit.id})]])
														}
													})
										})

						// 00点击科目下拉菜单
						$("[id='lesson.unit.subject.id']")
								.change(
										function() {
											// 0显示当前选中的值
											//alert($(this).children('option:selected').val()); 
											var subjectId = $(
													"#lesson\\.unit\\.subject\\.id")
													.val();
											var gradeId = $(
													"#lesson\\.unit\\.grade\\.id")
													.val()
											$
													.ajax({
														url : "/getUnitAjax",
														dataType : "json",
														type : "post",
														data : {
															'subject.id' : subjectId,
															'grade.id' : gradeId
														},
														success : function(data) {
															//0将data赋值给UnitAndLesson
															UnitAndLesson = data;
															// 1定义默认选项
															var html = "<option value=''>-请选择一个章节-</option>";
															// 2 清空章节下的选项
															$(
																	"#lesson\\.unit\\.id")
																	.empty();
															$(
																	"#lesson\\.unit\\.id")
																	.append(
																			html);
															for (var i = 0; i < data.list.length; i++) {
																//3 根据后台数据循环添加选项
																html = "<option value="+data.list[i].id+">"
																		+ data.list[i].title
																		+ "</option>";
																$(
																		"#lesson\\.unit\\.id")
																		.append(
																				html);
																// $("#lesson\\.unit\\.id").html(html);
															}
															;
															// 4 设置 默认选中后台传入的章节
															//$("#lesson\\.unit\\.id").val([[${question.lesson} eq null ? '':(${question.lesson.unit} eq null ? '':${question.lesson.unit.id})]])
														}
													})

											alert(subjectId + "-----------"
													+ gradeId);
										})

						// 00点击单元下拉菜单
						$("[id='lesson.unit.id']")
								.change(
										function() {
											//0根据单元生成课时
											var Unit = $("#lesson\\.unit\\.id")
													.val();
											//alert(Unit);
											if (Unit != '') {
												//var Lesson = UnitAndLesson.list[Unit-1].subjectLessonList;
												var Lesson = null;
												//debugger;
												for (var i = 0; i < UnitAndLesson.list.length; i++) {
													if (UnitAndLesson.list[i].id == Unit) {
														Lesson = UnitAndLesson.list[i].subjectLessonList;
														//alert(i);
													}
												}

												// 1定义默认选项
												var html = "<option value=''>-请选择一个课时-</option>";
												// 2 清空章节下的选项
												$("#lesson\\.id").empty();
												$("#lesson\\.id").append(html);
												for (var i = 0; i < Lesson.length; i++) {
													//3 根据后台数据循环添加选项
													html = "<option value="+Lesson[i].id+">"
															+ Lesson[i].title
															+ "</option>";
													$("#lesson\\.id").append(
															html);
													// $("#lesson\\.unit\\.id").html(html);
												}
												;
												// 4 设置 默认选中后台传入的课时
												// $("#lesson\\.id").val([[${question.lesson} eq null ? '':${question.lesson.id}]])
											}

										})
					});
</script>
</head>
<body>
	<div layout:fragment="content">
		<div class="place">
			<span>位置：</span>
			<ul class="placeul">
				<li><a href="/ordering/home">首页</a></li>
				<li><a href="#">题库显示信息</a></li>
			</ul>
		</div>

		<div class="rightinfo">
			<div class="tools">
				<ul class="toolbar">
					<li id="addQuestion"><span><img src="images/t01.png" /></span>添加</li>
				</ul>
			</div>
			<form action="getQuestion" method="post">
				<div class="container">
					<div class="row">
						<div class="col">
							<select class="form-control" aria-label="Large"
								th:field="${question.lesson.unit.grade.id}">
								<option value="">-请选择一个年级-</option>
								<option th:each="grade : ${gradeList.list}"
									th:value="${grade.id}" th:text="${grade.name}">option</option>
							</select>
						</div>
						<div class="col">
							<select class="form-control" aria-label="Large"
								th:field="${question.lesson.unit.subject.id}">
								<option value="">-请选择一个学科-</option>
								<option th:each="subject : ${subjectList.list}"
									th:value="${subject.id}" th:text="${subject.name}">option</option>
							</select>
						</div>
						<div class="col">
							<select class="form-control" aria-label="Large"
								th:field="${question.lesson.unit.id}">
								<option value="">-请选择一个章节-</option>
								<option th:each="unit : ${unitList.list}" th:value="${unit.id}"
									th:text="${unit.title}">option</option>

							</select>
						</div>
						<div class="col">
							<select class="form-control" aria-label="Large"
								th:field="${question.lesson.id}">
								<option value="">-请选择一个课时-</option>


							</select>
						</div>
						<div class="col">
							<select class="form-control" aria-label="Large"
								th:field="${question.type}">
								<option value="">-请选择一个类型-</option>
								<option value="1">选择题</option>
								<option value="2">填空题</option>
							</select>
						</div>
						<div class="col">
							<input type="text" th:field="${question.description}"
								placeholder="请输入题目内容" class="form-control" aria-label="Large"
								aria-describedby="inputGroup-sizing-sm" />
						</div>
						<div class="col">
							<button type="submit" class="btn btn-primary ">搜索</button>
						</div>
					</div>
				</div>
			</form>
			<br />
			<table class="table table-hover">
				<thead>
					<tr>
						<td>ID</td>
						<td>所属年级</td>
						<td>科目</td>
						<td>章节</td>
						<td>课时</td>
						<td>类型</td>
						<td>题目内容</td>
						<td>题目选项</td>
						<td>题目答案</td>
						<td>布置次数</td>
						<td>正确次数</td>
						<td>错误次数</td>
						<td>操作</td>
					</tr>
				</thead>
				<tbody th:object="${questionPageBean}">
					<tr th:each="que :*{list}">
						<td th:text="${que.id}">ID</td>
						<td
							th:text="${que.lesson} eq null ? '':(${que.lesson.unit} eq null ? '':(${que.lesson.unit.grade} eq null ? '':${que.lesson.unit.grade.name})) ">年级</td>
						<td
							th:text="${que.lesson} eq null ? '':(${que.lesson.unit} eq null ? '':(${que.lesson.unit.subject} eq null ? '':${que.lesson.unit.subject.name})) ">科目</td>
						<td
							th:text="${que.lesson} eq null ? '':(${que.lesson.unit} eq null ? '':${que.lesson.unit.title})">章节</td>
						<td th:text="${que.lesson} eq null ? '':${que.lesson.title}">课时</td>
						<td th:text="${que.type}">类型</td>
						<td th:text="${que.description}">内容</td>
						<td th:unless="${que.answerList} eq null">
							<ul th:each=" ans : ${que.answerList}">
								<li th:text="${ans.description}"></li>
							</ul>
						</td>
						<td th:text="${que.correctAnswer}">正确答案</td>
						<td th:text="${que.realeaseCount}">布置次数</td>
						<td th:text="${que.correctCount}">正确次数</td>
						<td th:text="${que.errorCount}">错误次数</td>
						 <td><a href="#"
							th:href="@{/updateStudentHTML(studentId=)}">编辑</a> <a
							href="#"
							th:href="@{/deleteQuestion(id=${que.id},currentPage=${questionPageBean.currentPage} , lesson.unit.grade.id=${question.lesson} eq null ? '':(${question.lesson.unit} eq null ? '':(${question.lesson.unit.grade} eq null ? '':${question.lesson.unit.grade.id})) , lesson.unit.subject.id=${question.lesson} eq null ? '':(${question.lesson.unit} eq null ? '':(${question.lesson.unit.subject} eq null ? '':${question.lesson.unit.subject.id})) , lesson.unit.id=${question.lesson} eq null ? '':(${question.lesson.unit} eq null ? '':${question.lesson.unit.id}) , lesson.id=${question.lesson} eq null ? '':${question.lesson.id} , type=${question.type} , description=${question.description})}">删除</a></td>
					</tr>
				</tbody>
			</table>
			<div th:include="page :: QuestionPager" th:remove="tag"></div>
		</div>
	</div>
</body>
</html>
